import count from "./styles/count.module.css"
import { useState } from "react"
import { message } from "antd"

const Count = (props) =>{
    const [messageApi, contextHolder] = message.useMessage();
    const count_ = props.count
    const [count_n, setCount] = useState(count_)
    const Revice = props.Revice
    const index  = props.index
    const add = () =>{
        setCount(count_n + 1)
        Revice({count:count_n + 1,index:index})
    }
    const dec = () =>{
        if(count_n > 1){
            setCount(count_n - 1)
            Revice({count:count_n -1,index:index})
        }else{
            messageApi.open({
                type: 'error',
                content: '不能再减了',
            });
        }
    }
    return (
        <div className={count.app}>
            {contextHolder}
            <div className={count.dec} onClick={dec}>-</div>
            <div className={count.count}>{count_n}</div>
            <div className={count.dec} onClick={add}>+</div>
        </div>
    )
}

export default Count